import React, { useState } from 'react';
// import { observer, useAsObservableSource } from 'mobx-react-lite';
import * as XLSX from 'xlsx';

const CustomExcel = props => {
  console.log('props', props);
  const [data,setData] = useState('');
  // const { handleChangeOutputParams, handleRunEvent, changeEventParams } = props;

  const getFile = async e => {
    const file = e.target.files[0];
    const reader = new FileReader();
    reader.readAsArrayBuffer(file);
    reader.onload = function() {
      const buffer = reader.result;
      const bytes = new Uint8Array(buffer);
      const length = bytes.byteLength;
      let binary = '';
      for (let i = 0; i < length; i++) {
        binary += String.fromCharCode(bytes[i]);
      }
      const wb = XLSX.read(binary, {
        type: 'binary',
      });
      const outdata = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
      console.log(outdata);
      setData(JSON.stringify(outdata));
    };
  };
  return (
    <div>
      <p>自定义组件之获取Excel内容</p>
      <input type="file" onChange={getFile} />
      <p>{data}</p>
    </div>
  );
};

export default CustomExcel;
